<template>
  <div id="Inventory">
    <root name="Inventory">
      <SafeHeader
        v-bind="{
          title: '盘点任务',
          isBack: true,
          fixedTop: true,
        }"
      >
      </SafeHeader>
      <v-container class="my-4 white lighten-5" style="line-height: 1.75rem">

        <!--py-2 card-lable  disabled      dense-->
        <v-row class="mt-1">
          <v-col cols="4" class="lable " @click="sourceOrderQuery">盘点任务</v-col>
          <!--<input  @keydown.13="taskCodeSearch" :value="form.billNo"  placeholder="请选择盘点任务" />-->
          <v-text-field
            class="my-0"
            v-model="form.billNo"
            hide-details
            @keydown.13="taskCodeSearch"
            placeholder="请选择盘点任务"
          >
          </v-text-field>
        </v-row>
        <v-row class="line"></v-row>

        <v-row class="mt-1">
          <v-col cols="4" class="lable">盘点任务类型</v-col>
          <v-col class="py-2 card-value">{{ form.type }}</v-col>
        </v-row>
        <v-row class="line"></v-row>

        <v-row class="mt-1">
          <v-col cols="3" class="lable"> 盘点仓库 </v-col>
          <v-col class="py-2 card-value">{{ form.wareName }}</v-col>
        </v-row>
        <v-row class="line"></v-row>

        <v-row class="mt-1">
          <v-col cols="3" class="lable"> 创建日期 </v-col>
          <v-col class="py-2 card-value">{{ form.createTime }}</v-col>
        </v-row>
      </v-container>
      <v-container class="task_list mb-15 white">
        <v-row>
          <v-col
            cols="12"
            class="card-title"
            style="padding-bottom: 8px; padding-top: 8px"
          >列表</v-col
          >
        </v-row>
        <v-divider class="mb-2"></v-divider>

        <!--列表 --------->
        <div v-if="form.taskList[0]">
          <v-container v-for="(item, index) in form.taskList" :key="index">
            <v-row>
              <v-col cols="12" class="pa-0 pb-2">
                <v-card outlined style="background-color: #f2f3f5">
                  <v-card-subtitle>
                    <v-row
                      class="
                          pa-0
                          d-flex
                          flex-row
                          justify-space-between
                          wms-v-row
                        "
                    >
                      <v-col cols="4" class="py-1 card-lable">任务编号</v-col>
                      <v-col class="py-1 card-value">{{item.taskBillNo}}</v-col>
                    </v-row>
                    <v-row
                      class="
                          pa-0
                          d-flex
                          flex-row
                          justify-space-between
                          wms-v-row
                        "
                    >
                      <v-col cols="4" class="py-1 card-lable px-2">盘点库位</v-col>
                      <v-col class="py-1 card-value px-2">{{item.cellCode}}</v-col>
                    </v-row>
                    <v-row
                      class="
                          pa-0
                          d-flex
                          flex-row
                          justify-space-between
                          wms-v-row
                        "
                    >
                      <v-col cols="4" class="py-1 card-lable px-2">容器编码</v-col>
                      <v-col class="py-1 card-value px-2">{{item.boxCode}}</v-col>
                    </v-row>
                    <v-row class="
                          pa-0
                          d-flex
                          flex-row
                          justify-space-between
                          wms-v-row
                        "
                    >
                      <v-col cols="4" class="py-1 card-lable">操作号</v-col>
                      <v-col class="py-1 card-value"> <a class="a-btn" @click="goto(item)">
                        执行
                      </a></v-col>
                    </v-row>
                  </v-card-subtitle>
                </v-card>
              </v-col>
            </v-row>
          </v-container>
        </div>


        <v-row>
          <v-col cols="12" class="text-center">暂无数据</v-col>
        </v-row>
      </v-container>
      <div v-show="hidshow" class="footer">
        <v-bottom-navigation
          height="60"
          style="background: transparent; box-shadow: none"
          v-show="hidshow"
        >
          <v-row
            class="pa-0 ma-0 justify-center"
            style="background: transparent"
            v-show="hidshow"
          >
            <v-col
              cols="12"
              class="pa-0 ma-0 d-flex justify-center align-center mb-2 px-2"
              style="background: transparent"
            >
              <v-btn
                class="wms-submit-btn"
                block
                style="
                  background-color: #193690;
                  height: 100%;
                  border-radius: 10px;
                "
                @click="sourceOrderQuery"
                v-show="hidshow"
                >源单查询</v-btn
              >
            </v-col>
          </v-row>
        </v-bottom-navigation>
      </div>
    </root>
  </div>
</template>

<script>
import Root from "@/components/Root.vue";
import SafeHeader from "@/components/safeHeader_wms.vue";
import wms from "@/utils/business_wms";
import _ from "lodash";
import { apiList } from "@/static/apiList";
import { Storage } from "@/utils/storage.js";

export default {
  name: "Inventory",
  components: {
    Root,
    SafeHeader,
  },
  data() {
    return {
      //form表单
      form:{
        billNo:'',
        type:'',
        wareName:'',
        createTime:'',
        taskList: [],
      },

      //遍历表格
      tableData: [],

      //默认屏幕高度
      docmHeight: document.documentElement.clientHeight,
      //实时屏幕高度
      showHeight: document.documentElement.clientHeight,
      //隐藏或显示下方按钮
      hidshow: true,

      overlay: false,
      taskInput: true,
      tab: null,
      dialog: false,
      //   任务标签表单
      taskFrom: {
        billNo: "",
        supplierName: "",
        expectTime: "",
        asnState: "",
        //   任务页面列表
        taskList: [],
      },

      //   过渡对象
      oldReceipFrom: {
        // 收货单数据
        receiptList: [],
      },
      sheet: false,
//     taskBillNo: '',
      pdInfo:{
        stockMasterId: '',
        stockMasterCode: '',
        stockTaskCode: '',
        wareId: '',
        stockTakeTaskId: '',
      }

    };

  },
  methods: {
    //入库任务页面点收货跳转到收货作业，并传递物料信息参数
    async goto(item) {
      console.log("item：", item)

      if (window.navigator.userAgent.toLowerCase().includes("apicloud")) {
        window.api.sendEvent({
          name: "InventoryWork",
          extra: {
            stockTakeMasterId: item.stockTakeMasterId,
            stockTakeTaskId: item.stockTakeTaskId,
            stockMasterCode: item.billNo,
            taskBillNo: item.taskBillNo,
            wareId: item.wareId,
            cellCode: item.cellCode,
            boxCode:item.boxCode,
          },
        });
        window.api.openWin({
          name: "InventoryWork",
          url: "./InventoryWork.html",
          pageParam: {
            stockTakeMasterId: item.stockTakeMasterId,
            stockTakeTaskId: item.stockTakeTaskId,
            stockMasterCode: item.billNo,
            taskBillNo: item.taskBillNo,
            wareId: item.wareId,
            cellCode: item.cellCode,
            boxCode:item.boxCode,
          },
        });
      } else {
        this.$root.api.api.sendEvent({
          name: "InventoryWork",
          extra: {
            stockTakeMasterId: item.stockTakeMasterId,
            stockTakeTaskId: item.stockTakeTaskId,
            stockMasterCode: item.billNo,
            taskBillNo: item.taskBillNo,
            wareId: item.wareId,
            cellCode: item.cellCode,
            boxCode:item.boxCode,
          },
        });
        this.$root.api.api.openWin({
          name: "InventoryWork",
          url: "./InventoryWork.html",
          pageParam: {
            stockTakeMasterId: item.stockTakeMasterId,
            stockTakeTaskId: item.stockTakeTaskId,
            stockMasterCode: item.billNo,
            taskBillNo: item.taskBillNo,
            wareId: item.wareId,
            cellCode: item.cellCode,
            boxCode:item.boxCode,
          },
        });
      }
    },
    // 一种是输入单号进行查询，第二种是通过源单查询带出单号进行查询
    taskCodeSearch() {
      if (!this.form.billNo) {
        return;
      }
      let params = {
        billNo: this.form.billNo,
        state:1
      };
      // 通过接口获取单号数据和列表
      this.overlay = true;

      wms.get({ url: "/stock/take/masters/findByBillNo", data: params })
        .then((res) => {
          console.log(JSON.stringify(res.data), !_.isEmpty(res.data.data));
          if (
            res.status == 200 &&
            res.data.code == 200 &&
            !_.isEmpty(res.data.data)
          ) {
            //判断状态是否正确
            let dataObj = res.data.data;
            console.log(JSON.stringify(dataObj));
            this.taskInput = true;
            this.form.type = dataObj.type == 1 ? '随机抽盘' : (dataObj.type == 2 ? '指定货位盘点' : '全盘');
            this.form.wareName = dataObj.wareName;
            this.form.createTime = dataObj.createTime;

            console.log("11111:");
       wms.get({ url: "/stock/take/tasks/list", data: { stockTakeMasterId : dataObj.stockTakeMasterId, state:1 } })
              .then((res) => {
                if (
                  res.status == 200 &&
                  res.data.code == 200 &&
                  !_.isEmpty(res.data.data)
                ) {
                  let dataList = res.data.data.list;
                  console.log("dataList:" + dataList);

//                  this.pdInfo.stockTakeMasterId = dataList[0].stockTakeMasterId;
//                 this.pdInfo.stockTaskCode = dataList[0].taskBillNo;
//                  this.pdInfo.stockTakeTaskId = dataList[0].stockTakeTaskId;

                  this.form.taskList = dataList;
//
//                  console.log("this.form.taskList:" + this.form.taskList);
                }
                this.overlay = false;

              });
          } else {
            this.overlay = false;
            //提示
            console.log("未查询到数据");
          }
        });
    },


    // 源单查询
    sourceOrderQuery() {
      if (window.navigator.userAgent.toLowerCase().includes("apicloud")) {
        window.api.openWin({
          name: "Inventory_OrderList",
          url: "./Inventory_OrderList.html",
        });
      } else {
        this.$root.api.api.openWin({
          name: "Inventory_OrderList",
          url: "./Inventory_OrderList.html",
        });
      }
    },

  },
  mounted() {
    //监听页面高度的变化
    window.onresize = () => {
      return (() => {
        this.showHeight = document.body.clientHeight;
      })();
    };

    let pageParam;
    if (window.navigator.userAgent.toLowerCase().includes("apicloud")) {
      pageParam = window.api.pageParam;
      this.form.billNo = pageParam.billNo;
      this.taskCodeSearch();
      window.api.addEventListener(
        {
          name: "Inventory",
        },
        (res) => {
          console.log(res.value.billNo);
          this.form.billNo = res.value.billNo;
          this.taskCodeSearch();
        }
      );
    } else {
      pageParam = this.$root.api.api.pageParam;
      this.form.billNo = pageParam.billNo;
      this.taskCodeSearch();
      this.$root.api.api.addEventListener(
        {
          name: "Inventory",
        },
        (res) => {
          console.log(res.value.billNo);
          this.form.billNo = res.value.billNo;
          this.taskCodeSearch();
        }
      );
    }
  },
  watch: {
    //判断按钮是否显示
    showHeight: function () {
      console.log("111" + this.showHeight + this.docmHeight);
      if (this.docmHeight > this.showHeight) {
        this.hidshow = false;
      } else {
        this.hidshow = true;
      }
    },
  },
};
</script>


<style lang="scss" scoped>
  .a-btn{
    color: #0794d8;
    margin-right: 5px;
  }
  .box{
    height:calc(100vh - 220px);
    width:100%;
    overflow-y:auto;/** 必须，否则当表格数据过多时，不会产生滚动条，而是自动延长该div的高度 */
    position:relative;/** 必须，若不设置，拷贝得来的表头将相对于其设置该属性为该值的父节点（或间接父节点）定位，如果没有，则相对于body */
  }
  table,tr,td,th{
    border:1px solid #ccd;
    border-collapse:collapse;
  }
  table{
    width:100%;
  }
  td{
    height:.30px;
    /*width:50px;*//** 固定单元格宽度，防止分离表头后，表头与数据行错位（缺点） */
    line-height:24px;
    padding:3px 5px;
    /*background-color:#ddd;*/
    word-break:break-all;/** 设置当文本过长时换行 */
  }
  th{
    height:24px;
    width:50px;/** 不管是固定像素或是百分比，应与对应数据列的宽度一致 */
    line-height:24px;
    background-color:#d3ddef;
  }
.footer {
  position: absolute;
  padding-top: 20px;
  width: 100%;
  bottom: 0;
}
.lable{
  font-size: 14px;
  float: left;
  width: 30%;
}
.line{
  border: 1px solid #f4f1f9;
}
</style>

<style lang="sass" scoped>
.v-tabs
  height: 100%
  background-color: transparent
  ::v-deep.v-tabs-items
    background-color: transparent

.receiptList
  .receiptList_detail
    padding: 8px
    min-height: 5rem
    .col
      padding: 2px
      min-height: 1rem
      text-align: right

    .row
      margin: 0
  ::v-deep.receiptList_expansion_panel
    .v-expansion-panel-content__wrap
      padding: 0 0 8px 0
.task
  padding-bottom: 56px
  &_from
    background-color: #fff
    margin-bottom: 6px
    // .v-sheet.v-card
    //   border-radius: 10px
    //   .v-card__subtitle
    //     padding: 6px
    .v-text-field
      ::v-deep.v-input__prepend-inner
        margin-top: 8px
        display: flex
        font-size: 0.875rem
        min-width: 4rem
        .v-input__append-inner
          .v-btn
            padding: 0 10px
            margin-bottom: 2px

            .col
              padding-bottom: 6px

  &_list
    // background-color: #fff
    .v-card__subtitle
      .row + .row
        margin-top: 6px
        justify-content: flex-end
        padding-right: 10px

        .col
          padding: 6px 8px

#receiptDialog
  background-color: #F2F3F5 !important

  .headline
    background-color: #193690
    color: #fff
    justify-content: center
    font-size: 18px !important
    line-height: 1.75
    padding: 40px 12px 8px 12px !important

  .v-card__subtitle
    display: flex
    margin: 0
    padding-bottom: 56px
    .row
      margin: 0
      background-color: #fff
      .col
        min-height: 1rem
        padding: 8px
    .receiving_heard
      border-top: 1px solid grey
      font-size: 16px
      font-weight: bold
      .row
        background-color: inherit

  .v-card__text
    padding: 0 10px !important
    .row
      margin: 0
      .col
        padding: 8px
        ::v-deep.v-input__prepend-outer
          min-width: 2rem
          margin-top: 10px
  ::v-deep.navigationBtns
    .navigationBtns_return
      .v-btn__content
        color: #193690

::v-deep.v-bottom-navigation
  .v-btn__content
    color: #fff
    font-size: 1rem

.inputPlaceholder
  ::v-deep.v-text-field__slot
    input::-webkit-input-placeholder
      font-size: 15px
    input::-moz-placeholder
      font-size: 15px
    input:-moz-placeholder
      font-size: 15px
    input:-ms-input-placeholder
      font-size: 15px
.receipt
  padding-bottom: 56px
  .v-card-list_title
    font-size: 14px !important
</style>
